<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>甜品展示页面 王添祎</title>
		<style>
			*{
				margin: 0;
				padding: 0;
				
			}
			body{
				background: #ffcccb;
				font-family: "微软雅黑";
				font-size: 24px;;
			}
			.n1{
				width: 800px;
				height: 100px;
				margin: 0 auto;
			}
			.n1 div{
				float: left;
				width:120px;
				height: 40px;
				background: #92fffc;
				border-radius: 10px;
				border: solid 3px black;
				text-align: center;
				line-height: 40px;
				margin-top: 25px;
				margin-left: 50px;
			}
			.n2{
				width: 800px;
				height: 120px;
				margin: 0 auto;
			}
			.n2 img{
				float: left;
				margin-top: 25px;
				margin-left: 60px;
			}
			
			
			.n3{
				width: 800px;
				height: 100px;
				margin: 0 auto;
			}
			.n3 div{
				float: left;
				width:120px;
				height: 40px;
				border-radius: 10px;
				border: solid 3px black;
				text-align: center;
				line-height: 40px;
				margin-top: 25px;
				margin-left: 80px;
				background: white;
			}
		</style>
	</head>
	<body>
		<div class="n1">
			<div> 首页</div>
			<div> 甜品展示</div>
			<div> 订单页面</div>
			<div> 登录注册</div>
		</div>
		
		<div class="n2">
			<img src="img/t1.png" />
			<img src="img/1.png" width="100" height="100"/>
			<img src="img/2.png" width="100" height="100"/>
			<img src="img/3.png" width="100" height="100"/>
		</div>
		<div class="n2">
			<img src="img/t2.png" />
			<img src="img/4.png" width="100" height="100"/>
			<img src="img/5.png" width="100" height="100"/>
			<img src="img/6.png" width="100" height="100"/>
		</div>
		<div class="n2">
			<img src="img/t3.png" />
			<img src="img/7.png" width="100" height="100"/>
			<img src="img/8.png" width="100" height="100"/>
			<img src="img/9.png" width="100" height="100"/>
		</div>
		<div class="n2">
			<img src="img/t4.png" />
			<img src="img/10.png" width="100" height="100"/>
			<img src="img/11.png" width="100" height="100"/>
			<img src="img/12.png" width="100" height="100"/>
		</div>
		<div class="n2">
			<img src="img/t5.png" />
			<img src="img/1.png" width="100" height="100"/>
			<img src="img/2.png" width="100" height="100"/>
			<img src="img/3.png" width="100" height="100"/>
		</div>
		<div class="n3">
			<div style="color: red;"> 加入购物车</div>
			
			<div style="color: blue;float: right;margin-right: 100px;;"> 订单管理</div>
		</div>
	</body>
</html>

